<template>
  <footer class="bg-gray-800 text-white mt-12">
    <div class="container mx-auto px-4 py-8">
      <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
        <div>
          <h4 class="text-lg font-bold mb-4">
            学习平台
          </h4>
          <p class="text-gray-400 text-sm">
            提供高质量的在线课程，帮助你掌握前沿技术和专业知识。
          </p>
          <div class="flex space-x-4 mt-4">
            <a
              href="#"
              class="text-gray-400 hover:text-white transition-colors duration-300"
            >
              <i class="fa-brands fa-github text-xl" />
            </a>
            <a
              href="#"
              class="text-gray-400 hover:text-white transition-colors duration-300"
            >
              <i class="fa-brands fa-twitter text-xl" />
            </a>
            <a
              href="#"
              class="text-gray-400 hover:text-white transition-colors duration-300"
            >
              <i class="fa-brands fa-linkedin text-xl" />
            </a>
          </div>
        </div>
        <div>
          <h4 class="text-lg font-bold mb-4">
            课程分类
          </h4>
          <ul class="space-y-2 text-gray-400">
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >前端开发</a>
            </li>
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >后端开发</a>
            </li>
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >移动开发</a>
            </li>
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >数据科学</a>
            </li>
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >人工智能</a>
            </li>
          </ul>
        </div>
        <div>
          <h4 class="text-lg font-bold mb-4">
            关于我们
          </h4>
          <ul class="space-y-2 text-gray-400">
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >公司简介</a>
            </li>
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >讲师团队</a>
            </li>
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >合作伙伴</a>
            </li>
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >加入我们</a>
            </li>
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >联系方式</a>
            </li>
          </ul>
        </div>
        <div>
          <h4 class="text-lg font-bold mb-4">
            支持
          </h4>
          <ul class="space-y-2 text-gray-400">
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >帮助中心</a>
            </li>
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >常见问题</a>
            </li>
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >意见反馈</a>
            </li>
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >隐私政策</a>
            </li>
            <li>
              <a
                href="#"
                class="hover:text-white transition-colors duration-300"
              >服务条款</a>
            </li>
          </ul>
        </div>
      </div>
      <div class="border-t border-gray-700 mt-8 pt-6 text-center text-gray-500 text-sm">
        <p>© 2025 学习平台. 保留所有权利.</p>
      </div>
    </div>
  </footer>
</template>

<script setup></script>

<style scoped></style>
